<template>
  <div class="page-box h100 display-flex czbj">
    <!-- sonRouter="yybureauFormationBJ" 为跳转新的页面编辑 -->
    <dxtable
      :dataJson="dataJson"
      :portUrl="portUrl"
      :formJson="formJson"
      :qx="qx"
      :isshowXz="false"
      ref="databale"
      :hidebj="true"
      :czFun="czFun"
      :isshowSc="false"
    ></dxtable>
    <n-modal
      v-model:show="showModal"
      preset="card"
      class="Stock-diagnosisxcxty"
      @close="guanbis"
    >
      <template #header>
        <div>编辑课程</div>
      </template>
      <div>
        <iframe
          :src="
            'https://duxinggj-1251133427.cos.ap-guangzhou.myqcloud.com/case/kcgl/index.html#/pages/trainingInstitutions/addCourse?jigouId=' +
            jigouId +
            '&id=' +
            kcid
          "
        ></iframe>
      </div>
      <template #action>
        <div class="tr">
          <n-button @click="guanbis"> 关闭 </n-button>
        </div>
      </template>
    </n-modal>
  </div>
</template>
<script lang="ts" setup>
import dxtable from "../../../components/util/dxtable.vue";
import sort from "../../../components/util/sort.vue";
import { dxget, dxpost } from "../../../util/index";
import { NButton, NImage, NTag } from "naive-ui";
import { h, ref, reactive } from "vue";
const databale = ref();
const initeer = () => {
  databale.value.initDataExpose();
};
const fdfdsgta = ref([]);
const fdfdsgtb = ref([]);
const fdfdsgtc = ref([]);
const fdfdsgtd = ref([]);
const fdfdsgte = ref([]);
const showModal = ref();
const kcid = ref();
const jigouId = ref();
let dataJson = [
  {
    title: "学校",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "title",
    width: "",
    search: false,
    istable: true,
    required: false,
  },
  {
    title: "课程名称",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 24,
    key: "name",
    width: "",
    search: true,
    istable: true,
    required: false,
  },
  {
    title: "课程封面",
    type: "img",
    val: "",
    icon: "dx-img",
    span: 24,
    key: "cover",
    width: "80",
    search: false,
    istable: true,
    required: false,
  },
  {
    title: "课程类型",
    type: "select",
    options: [],
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "type",
    width: "",
    search: true,
    istable: true,
    required: false,
    render: (row) => {
      try {
        return fdfdsgtb.value.filter((a) => a.value == row.type)[0].label;
      } catch (e) {
        return "--";
      }
    },
  },
  {
    title: "年级",
    type: "select",
    options: [],
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "nianjiId",
    width: "",
    search: true,
    istable: true,
    required: false,
    render: (row) => {
      try {
        return fdfdsgtc.value.filter((a) => a.value == row.nianjiId)[0].label;
      } catch (e) {
        return "--";
      }
    },
  },
  {
    title: "学期",
    type: "select",
    options: [],
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "xueqiId",
    width: "",
    search: true,
    istable: true,
    required: false,
    render: (row) => {
      try {
        return fdfdsgtd.value.filter((a) => a.value == row.xueqiId)[0].label;
      } catch (e) {
        return "--";
      }
    },
  },

  {
    title: "上课教室",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "jiaoshimc",
    width: "",
    search: false,
    istable: true,
    required: false,
  },
  {
    title: "上课时间",
    width: 300,
    render: (row) => {
      const fb = JSON.parse(row.fenban);
      let jkxcre = [];
      fb.map((a) => {
        jkxcre.push(
          h("div", {}, a.xzczxda + "：" + a.zq + a.shangkea + "-" + a.shangkeb)
        );
      });
      return jkxcre;
    },
  },
  {
    title: "报名人数",
    render: (row) => {
      const fb = JSON.parse(row.fenban);
      let jkxcre = [];
      fb.map((a) => {
        jkxcre.push(h("div", {}, a.xzczxda + "：" + a.ybm + "/" + a.xzczxdb));
      });
      return jkxcre;
    },
  },
  //   {
  //     title: "课程简介",
  //     type: "textarea",
  //     val: "",
  //     icon: "dx-duohangwenben",
  //     span: 24,
  //     key: "jianjie",
  //     width: "",
  //     search: false,
  //     istable: false,
  //     required: false,
  //   },

  {
    title: "添加时间",
    key: "addTime",
    width: 150,
  },
];

const qx = {
  DeletePermissionID: "ccurriculumdel2222", //删除
  EditPermissionIdentifier: "", // 编辑
  NewPermissionIdentifier: "ccurriculumxz222", // 新建
  ViewPermissionID: "ccurriculumck", // 查看
};
const xxid = localStorage.xxid;
const portUrl = "courseManagement/curriculum?qyId=" + localStorage.qyId;

let formJson = reactive([
  {
    title: "上课教室",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 24,
    key: "jiaoshimc",
    width: "",
    search: false,
    istable: true,
    required: false,
  },
  {
    title: "轮播图",
    type: "imglist",
    val: [],
    icon: "dx-shurukuang",
    span: 24,
    key: "banner",
    width: "",
    search: false,
    istable: true,
    required: false,
  },
]);
const czFun = {
  fun: (row) => {
    return [
      h(
        NButton,
        {
          type: "info",
          quaternary: true,
          onClick: async (e) => {
            kcid.value = row.id;
            jigouId.value = row.jigouId;
            showModal.value = true;
          },
        },
        "编辑"
      ),
    ];
  },
};

// 获取字典内容
const xtgxxmfl = async () => {
  const { data }: any = await dxget(
    "dxgjAdmin/getzd/getzdJsList?ids=313,314,316,315"
  );
  fdfdsgta.value = data[0];
  fdfdsgtb.value = data[1];
  fdfdsgtc.value = data[2];
  fdfdsgtd.value = data[3];

  dataJson[3].options = [
    {
      label: "全部",
      value: "",
    },
    ...fdfdsgtb.value,
  ];
  dataJson[4].options = [
    {
      label: "全部",
      value: "",
    },
    ...fdfdsgtc.value,
  ];
  dataJson[5].options = [
    {
      label: "全部",
      value: "",
    },
    ...fdfdsgtd.value,
  ];
  dataJson[6].options = [
    {
      label: "全部",
      value: "",
    },
    ...fdfdsgta.value,
  ];

  // formJson[0].options = fdfdsgta.value;
  // formJson[1].options = fdfdsgtb.value;
  // formJson[5].options = fdfdsgtc.value;
  // formJson[6].options = fdfdsgtd.value;
};
xtgxxmfl();

const guanbis = () => {
  showModal.value = false;
  initeer();
};
</script>
<style scoped></style>
